﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Timesheet entry</title>


    <link href="../../sparkle_/css/2013/sparkle_jquery_ui.css" rel="stylesheet" />
    <link href="../../sparkle_/css/2013/sparkle.css" rel="stylesheet" />


    <style>
        #datepicker {
            height: 210px;
            margin-left: 16px;
        }


        /*div.ui-datepicker, .ui-datepicker td {
            font-size: 10px !important;
        }*/

        #timesheetGrid {
            margin-left: 16px;
            margin-right: 30px;
        }

        #timesheetGridContainer {
            padding-top: 0px;
            padding-left: 0px;
            padding-right: 2px;
            padding-bottom: 2px;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            height: 175px;
        }

        #sessionsGridContainer {
            padding-top: 0px;
            padding-left: 0px;
            padding-right: 2px;
            padding-bottom: 2px;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            height: 300px;
        }

        .days_total_row {
            font-weight: bold;
        }

        #header {
            height: 30px;
        }


        #grid1 {
            margin-left: 16px;
            margin-right: 30px;
        }


        /*.slick-cell.active {
            border: none;
            border-bottom: 1px solid #DBDEE1;
        }*/

        #timesheetGrid .slick-cell.selected {
            background: #EFF2F6;
        }

        #timesheetGrid .slick-cell.active {
            background: #A7CDF0;
        }

        /*#sessionsGridContainer.slick-cell.selected {
            background: #A7CDF0;
        }*/

        /*#sessionsGridContainer .slick-cell.active {
            border-bottom-color: #E2E3EA;
            border-bottom-width: 1px;
            border-bottom-style: solid;
            border-left-color: #E2E3EA;
            border-left-width: 1px;
            border-left-style: solid;
            border-right-color: #E2E3EA;
            border-right-width: 1px;
            border-right-style: solid;
        }*/
    </style>
</head>

<body class="sparkle-xrm">
     <div class="sparkle-wait-blockout" data-bind="fadeVisible: isBusy">
        <table height="100%" width="100%">
            <tr>
                <td align="center" valign="middle">
                    <img src="../../sparkle_/css/images/transparent_spacer.gif" />
                    <div id="Div1" style="width: 200px" data-bind="progressBar: isBusyProgress, visible: isBusyProgress != null"></div>
                    <div class="progress-label" data-bind="text: isBusyMessage"></div>

                </td>
            </tr>
        </table>
    </div>
    <div data-bind="template: { name: 'sparkle-form-tab-header', data: { title: 'Select Time Sheet' } }"></div>

    <div id="datepicker"></div>

    <div data-bind="template: { name: 'sparkle-form-tab-header', data: { title: 'Time Sheet Entry' } }"></div>
    <div id="timesheetGrid">
        <span id="toolbar" class="sparkle-gridtoolbar">
            <button class="gridtoolbar-button save16" data-bind="click: saveCommand()">Save</button>
            <button class="gridtoolbar-button delete16" data-bind="click: deleteCommand()">Delete Sessions</button>
            <button class="gridtoolbar-button reset16" data-bind="click: resetCommand()">Reset</button>
        </span>
        <div id="timesheetGridContainer">Table</div>

    </div>
    <div data-bind="template: { name: 'sparkle-form-tab-header', data: { title: 'Sessions' } }"></div>
    <div id="grid1">

        <div id="sessionsGridContainer">Table</div>

    </div>

    <script src="../../ClientGlobalContext.js.aspx" type="text/javascript"></script>


    <!-- Sparkle Xrm dependancies -->
    <script src="../../sparkle_/js/SparkleXrmUI_Dependancies.js"></script>
    <!-- Uncomment the following and comment about the script above to debug the individual dependancies-->
    <!--
    <script src="../../sparkle_/dependancies/SparkleXrm-jquery.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/jquery.event.drag.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/blockUI.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.core.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.grid.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.rowselectionmodel.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.checkboxselectcolumn.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.pager.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.editors.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/knockout.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/knockout.validation.debug.js" type="text/javascript"></script>-->
    

    <!-- Sparkle Xrm -->
    <script src="../../sparkle_/js/mscorlib.js" type="text/javascript"></script>
    <script src="../../sparkle_/js/SparkleXrm.js" type="text/javascript"></script>
    <script src="../../sparkle_/js/SparkleXrmUI.js" type="text/javascript"></script>

    <!-- Client Code -->
    <script src="../js/Client.js" type="text/javascript"></script>
    <script type="text/javascript">
        Client.TimeSheet.View.TimeSheetView.init();
        window.onbeforeunload = function () {
            return "Are you sure you want to navigate away, you will loose any unsaved data?";
        }
    </script>
</body>
</html>
